<!--
 * @Descripttion: 
 * @Author: ziwei
 * @Date: 2022-08-28 14:47:36
 * @LastEditors: ziwei
 * @LastEditTime: 2022-08-28 15:55:10
-->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>boardCastChannel发送</title>
  </head>
  <body>
    <main>
      <input id="js-input" placeholder="input message for broadcast" />
      <button id="js-btn">post message</button>
      <button id="js-close">close channel</button>
      <button id="js-open">open channel</button>
      <div>
        <a href="./跨页面通信1.html" target="_blank">open the other tab to watching broadcast between tabs</a
        >
      </div>
      <script>
        var bc = new BroadcastChannel("alienzhou");
        bc.postMessage({ from: "index", data:'112' });
      </script>
      <section class="iframe">
        <h2>iframe:</h2>
        <iframe src="./iframe.html"></iframe>
      </section>
      <footer>
        <a href="https://www.alienzhou.com/2019/04/01/broadcast-channel/"
          >Article in Chinese</a
        >
      </footer>
    </main>
    <section id="js-container">
      <div>me:</div>
      <div>me: 1</div>
    </section>
  </body>
</html>
